@import '../variables';
$radius: 5px;

$themecolor: #ffb8c6;
$buttoncolor: rgba(255, 184, 197, 0.5);
$subthemecolor: #67a856;
$themelight: #fff0f5;
$topbar: $themecolor;
$sidebar: #fff;
$bodycolor: $sidebar;
$headingtext: $subthemecolor;
$bodytext: #333333;
$linktext: $subthemecolor;
$linktext-hover: lighten($linktext, 20%);
$sidebar-text: #38495a;
$accentcolor: #e08dbc;
$accentlight: rgba(224, 141, 188, 0.2);
$accentdark: rgba(224, 141, 188, 0.5);
$background-color: rgba(171, 224, 174, 0.4);
$third-main-color: antiquewhite;
$textcolor: dimgray;
$primary: #e87b98;
$logo-mark-fill: lighten(desaturate($topbar, 10%), 15%);
$wikilinktext: $subthemecolor;
$wikilinktext-hover: gba(171, 224, 174, 0.9);

@import 'apply-colors';
@import 'apply-colors-light';

// add background-image
.main-container > #wrapper > #page-wrapper,
.page-editor-preview-container {
  background-color: rgba(255, 255, 255, 0.8);
  background-image: url('/images/themes/spring/spring02.svg');
  background-attachment: fixed;
  background-position: bottom;
  background-size: cover;
}

.sidebar {
  background: $themelight;
}

/*
 * user's page
 */

.growi .main .page-comments-row {
  border-top-color: $third-main-color;
}

/*
 * Accentcolor (green)
 */

header.affix {
  border-bottom: 4px solid $accentcolor;
}

.modal {
  .modal-header {
    border-bottom: 4px solid $accentcolor;
  }
}

#wrapper > .navbar > .navbar-header {
  border-bottom: 4px solid $accentcolor;
}

/*
 * Comments
 */

.page-comment {
  .page-comment-main {
    box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.2);

    .page-comment-creator > a {
      border-bottom: 1px double $subthemecolor;
    }
  }
}

div .page-comment-main {
  border-radius: 10px;
}

// add comment
div .comment-form-main {
  border-radius: 10px;
}

/*
 * Tabs
 */

.nav.nav-tabs > li.active > a {
  color: $subthemecolor;
}

.text-info,
body:not(.on-edit) .nav.nav-tabs {
  > li > a {
    color: $subthemecolor;
  }

  > li.active > a {
    color: $subthemecolor;
    background: linear-gradient(
      rgba($active-nav-tabs-bgcolor, 0) 50%,
      rgba($active-nav-tabs-bgcolor, 0) 90%,
      $active-nav-tabs-bgcolor 100%
    ); // overwrite only the bottom pixel
    background-color: $themelight;
  }
}

/*
 * button
 */

.btn-link {
  color: $subthemecolor;
}

.label-default {
  background-color: $primary;
}

div .btn-inverse {
  background-color: $themecolor;
  border: $themecolor;
}

div .btn-default {
  background-color: $accentlight;
  border-color: $accentdark;
}

.admin-page .btn-group.btn-toggle .btn.active[data-active-class='primary'] {
  color: $sidebar;
  background-color: $accentcolor;
  border-color: $accentdark;
}

/*
 * GROWI admin page #themeOptions
 */
.admin-page {
  #themeOptions {
    .theme-option-container.active a {
      border-color: $accentcolor;
    }
  }
}

button .btn-outline {
  background-color: $themelight;
}

input .btn-secondary {
  background: $themecolor;
}

/*
 *  Login page
 */

.login-page > #wrapper > #page-wrapper {
  background: $themelight;
  background-image: url('/images/themes/spring/spring.svg');
  background-attachment: fixed;
  background-position: bottom;
  background-size: cover;

  .link-switch {
    color: $themecolor;

    &:hover {
      color: $subthemecolor;
    }
  }
}

/*
 *  letter
 */

.help-block {
  padding: 5px;
  color: $textcolor;
  background-color: $accentlight;
  border-radius: 3px;
}

.panel-primary a {
  color: $subthemecolor;
}

/*
 *  panel
 */

.panel-timeline > .panel-heading {
  background-color: $third-main-color;
}

.panel-default > .panel-heading {
  background-color: $third-main-color;
}

.panel .panel-body {
  border-radius: 10px;
}
